<template>
  <div>
      <v-header :sellers="sellers"></v-header>
      <div class="tab">
        <div class="tab-item">
          <router-link to='/goods'>商品</router-link>
        </div>
        <div class="tab-item">
        <router-link to='/ratings'>评论</router-link>
        </div>
        <div class="tab-item">
        <router-link to='/sellers'>商家</router-link>
        </div>
      </div>
      <div class="content">
        content
      </div>
  </div>
</template>

<script>
import header from './components/header/header.vue'

export default {
  data () {
    return {
      sellers: {}
    }
  },
  created () {
    this.$http.get('/api/seller').then((resp) => {
      resp = resp.body
      console.log(resp)
      if (resp.errno === 0) {
        this.sellers = resp.data
      }
    })
  },
  components: {
    'v-header': header
  }
}
</script>

<style>
  .tab {
      display:flex;
      width:100%;
      height:40px;
      line-height:40px;
      border-bottom:rgba(7,17,27,0.1);
    }
  .tab-item {
    flex:1;
    text-align:center;
  }
  .tab-item > a {
      display:block;
      font-size:14px;
      color:rgb(77,85,93);
  }
  a.router-link-active {
    color:rgb(240,20,20);
  }
</style>
